<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:replace="layout :: common_header(~{::title})">
    <title >代办列表-ERP</title>
</head>
<body th:replace="layout :: common_body(~{::div.layui-body})">

<div class="layui-body" style="padding:15px;">
    <style type="text/css">
        .update {
            display: inline-block;
            margin-left: 15px;
            padding: 0 20px;
            height: 40px;
            line-height: 40px;
            font-size: 14px;
            background: #009789;
            color: #fff;
            text-align: center;
            border-radius: 3px;
            cursor: pointer;
        }

        .update i {
            display: inline-block;
            margin-right: 10px;
            vertical-align: middle;
            width: 30px;
            height: 30px;
            background: url();
        }
        .T-box {
            width: 400px;
            padding: 0 20px;
            text-align: left;
        }

        .T-box p {
            position: relative;
            height: 36px;
            line-height: 36px;
            font-size: 14px;
            margin-bottom: 15px;
        }

        .T-box p span {
            display: inline-block;
            padding-right: 15px;
            text-align: right;
            width: 110px;
            line-height: 36px;
            font-size: 14px;
        }

        .T-box p input, .T-box p select {
            width: 250px;
            padding: 0 5px;
            height: 34px;
            line-height: 34px;
            font-size: 14px;
            border: 1px solid #d3d3d3;
            outline: none;
        }

        .T-box p i {
            padding: 0 10px;
            line-height: 36px;
            font-style: normal;
        }

        .T-box p b {
            display: inline-block;
            margin-left: 10px;
            cursor: pointer;
            width: 60px;
            height: 36px;
            line-height: 36px;
            background: #c33;
            color: #fff;
            text-align: center;
            font-size: 13px;
            font-weight: normal;
        }
        .red{
            color: red;
        }
    </style>
    <div class="layui-tab layui-tab-brief" lay-filter="demo">
        <ul class="layui-tab-title">
            <li class="layui-this"><a href="/todo/list">代办列表</a></li>
        
        </ul>
    </div>

    <!-- content starts -->
<!--    <blockquote class="layui-elem-quote">订单总览</blockquote>-->

    <fieldset class="layui-elem-field">
        <legend>按条件搜索</legend>
        <div class="layui-field-box">
            <form class="layui-form layui-form-pane1" method="get" action="/todo/list">
    
                <div class="layui-form-item">
                    <div class="layui-inline">
                        <input type="text" name="content" th:value="${content}" placeholder="内容" class="layui-input" style="width: 200px" />
                    </div>
                   

                    <div class="layui-inline">
                        <div class="layui-input-inline">
                            <select name="status" id="status">
                                <option value="-1">全部状态</option>
                                <option  th:each="item: ${T(com.b2c.entity.enums.EnumTodoStatus).values()}" th:text="${item.name}" th:value="${item.index}">等待发货</option>
                            </select>
                        </div>
                    </div>
                

            
                <div class="layui-inline">
                    <label class="layui-form-label">更新时间</label>
                    <div class="layui-input-inline">
                        <input type="text" class="layui-input" name="startTime" th:value="${startTime}" id="startTime" autocomplete="off"
                               style="width: 180px;" placeholder="yyyy-MM-dd HH:mm:ss">
                    </div>
                    <div class="layui-input-inline">
                        <input type="text" class="layui-input" name="endTime" th:value="${endTime}" id="endTime" style="width: 180px;" autocomplete="off" placeholder="yyyy-MM-dd HH:mm:ss">
                    </div>
                </div>

                    <div class="layui-inline">
                        <button type="submit" class="layui-btn">搜索</button>
                        <i>总共：<span style="color: red" th:text="${totalSize}"></span>条记录</i>

                        <a id="add_todo" href="javascript:;" class="layui-btn layui-btn-warm">添加代办</a>

                        <a id="text_model" href="javascript:;" class="layui-btn layui-btn-primary layui-btn-sm">文本模式</a>
                    </div>


                </div>

            </form>
        </div>
    </fieldset>

    <!-- start dd-wrapper -->
    <link rel="stylesheet" href="/goods/order.css"/>
    <div class="dd-wrapper">
        <table class="dd-table">
            <tr>
                <th >ID</th>
                <th >代办事项</th>
                <th width="300px">处理结果</th>
                <th>店铺</th>
                <th>类型</th>
                <th >来源</th>
                <th >添加时间</th>
                <th >更新时间</th>
                <th>状态</th>
                <th >操作</th>
            </tr>
            <tr th:each="item:${lists}">
               <td ><span th:text="${item.id}"></span></td>
                <td >
                    <span th:text="${item.content}" th:attr="result=${item.result}" class="content"></span>
                    
                </td>
                <td >
                    <b th:text="${item.result}" ></b>
                    <span th:if="${item.status != 99}" th:attr="data-id=${item.id},result=${item.result}"  class="sellerRemark" title="输入处理结果">
                        <i class="layui-icon layui-icon-note"></i>
                    </span>
                </td>
                <td >
                    <span th:text="${item.shopName}" ></span>
                </td>
                <td >
                    <span th:if="${item.sourceType == 1}" >拼多多退货</span>
                </td>
                <td ><span th:text="${item.sourceId}" ></span></td>
                    <td ><span th:text="${item.createTime}" ></span></td>
                    <td ><span th:text="${item.updateTime}" ></span></td>
                <td >    
                    <span th:if="${item.status==0}" th:text="${T(com.b2c.entity.enums.EnumTodoStatus).getName(item.status)}"></span>
                  
                    <i th:if="${item.status==1}" title="处理中" class="layui-icon layui-icon-loading layui-icon layui-anim layui-anim-rotate layui-anim-loop"></i>
                    <i th:if="${item.status==99}" title="已完成" class="layui-icon layui-icon-ok"></i>
                </td>
                <td width="10%">
                    
                                
                    <a th:if="${item.status == 1 ||item.status == 0}" th:attr="data-id=${item.id}" class="layui-btn-warm layui-btn-sm todoCompleted" style="color: #fff; " href="javascript:;">完结</a>
                    
                </td>
                
                
            </tr>
  
        </table>
    </div>
    <!-- end dd-wrapper -->
    <div class="layui-box layui-laypage layui-laypage-default pageBox">
        <paging:pager th:value="${pageIndex}" th:rows="${totalSize}" th:size="${pageSize}"/>
    </div>

    <script type="text/template" id="modify_address">
        <div class="T-box">
            <p><span>姓名</span><input type="text" id="userName" name="userName" /></p>
            <p><span>手机号</span><input type="text" id="mobile" name="mobile" /></p>
            <p><span>收货地址</span><input type="text" id="address" name="address"/></p>
        </div>
    </script>
    <script type="text/javascript" src="/goods/Tips/Tips.min.js"></script>
    <script type="text/javascript">
        var layer;
        var $;
        var windowOpen;
        layui.use(['laydate', 'jquery', 'form', 'layer'], function () {
            var laydate = layui.laydate;
            $ = layui.jquery;
            var form = layui.form;
            layer = layui.layer;
            laydate.render({
                elem: '#startTime'
                ,type: 'date'
            });
            laydate.render({
                elem: '#endTime'
                ,type: 'date'
            });

            $(function () {
                var status = '[[${status}]]';
                $("#status").val(status);
                form.render('select');

                $("#text_model").click(function(){
                    var remarkT = "";
                    $(".content").each(function(){
                        var r = $(this).attr("result");
                        if(r == undefined) r='';
                        remarkT += $(this).text()+r+"\r\n";
                    })
                    layer.prompt({
                    formType: 2,
                    value: remarkT,
                    title: '文本模式'
                    });
                })//文本模式结束
            
            //添加新代办
            $("#add_todo").click(function(){
                
                layer.prompt({
                    formType: 2,
                    value: '',
                    title: '请输入代办内容'
                }, function(value, index, elem){
                    var data = {content:value};
                    $.ajax({
                        url: "/ajax_todo/add_todo",
                        type: "POST",
                        dataType: "JSON",
                        contentType: 'application/json',
                        data:JSON.stringify(data),
                        success: function (res) {
                            if(res.code == 0){
                                layer.close(index)
                                layer.msg(res.msg);
                                location.reload(true);
                            }else
                                layer.alert(res.msg);
                        }
                    });
                });
            });//add end

            $(".sellerRemark").click(function(){
                var id = $(this).attr('data-id');
                var remarkT = $(this).attr('result');
                var obj = $(this).siblings('b').eq(0);

                layer.prompt({
                    formType: 2,
                    value: remarkT,
                    title: '请处理结果'
                }, function(value, index, elem){
                    var data = {id:id, result:value};
                    $.ajax({
                        url: "/ajax_todo/todo_handle",
                        type: "POST",
                        dataType: "JSON",
                        contentType: 'application/json',
                        data:JSON.stringify(data),
                        success: function (res) {

                            if(res.code == 0){

                                $(obj).text(value);
                                layer.close(index)
                                layer.msg(res.msg);
                                $(obj).parent().siblings().eq(7).text("处理中");
                                // $(obj).parent().siblings().eq(8).html('<a class="layui-btn-warm layui-btn-sm todoCompleted" style="color: #fff; " href="javascript:;" data-id="'+id+'">完结</a>')
                                // location=location;
                                //<a class="layui-btn-warm layui-btn-sm todoCompleted" style="color: #fff; " href="javascript:;" data-id="90">完结</a>
                            }else
                                layer.alert(res.msg);
                        }
                    });


                });
            });

    
                //拦截订单（退货）
                $(".todoCompleted").on("click",function () {
                    var $this = $(this);
                    let dataId = $(this).attr('data-id');
                   

                    if(confirm("该操作不可逆，是否确定完结？")){
                        var data = {
                            dataId: dataId
                        };
                        $.ajax({
                            url: "/ajax_todo/todo_completed",
                            type: "POST",
                            dataType: 'json',
                            contentType: 'application/json',
                            data: JSON.stringify(data),
                            success: function (res) {
                                if (res.code == 0) {
                                    layer.msg("处理成功");
                                    // location.reload(true);
                                    
                                    $this.parent().siblings().eq(8).html("已完成");
                                    $this.remove();
                                } else {
                                    alert(res.msg);
                                    return false;
                                }
                            }
                        });
                    }

                })

            })
        });

    </script>

    <!-- 模板  -->
    <script type="text/template" id="tpl-group">
        <div class="T-box" style="width: 1000px">
            <div class="dd-log">
                <ul id="sendContext">
                </ul>
            </div>
        </div>
    </script>


</div>
</body>
<html>
